<template>
  <div class="units-management">
    <el-table ref="multipleTable" :data="InfoTable" tooltip-effect="dark" style="width: 100%; margin-top: 20px" border
      stripe @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="45" fixed align="center"></el-table-column>

      <el-table-column label="序号" align="center" type="index" :index="indexAdd" width="60">
      </el-table-column>

      <el-table-column prop="name" label="名称" width="80" align="center"></el-table-column>

      <el-table-column prop="unitsPeoples" width="73" label="单位人数" sortable align="center">
      </el-table-column>

      <el-table-column prop="telephone" width="110" label="联系方式" align="center">
      </el-table-column>

      <el-table-column prop="address" width="180" label="地址" align="center">
      </el-table-column>

      <el-table-column prop="icon" width="170" label="操作" align="center">
        <template slot-scope="scope">
          <el-button type="text" @click="showInfo(scope.row)">详情</el-button>
          <el-divider direction="vertical"></el-divider>

          <el-button type="text" @click="editInfo(scope.row)">编辑</el-button>
          <el-divider direction="vertical"></el-divider>

          <template>
            <el-popconfirm title="确定单位删除吗？" @confirm="delHandle(scope.row)">
              <el-button type="text" slot="reference">删除</el-button>
            </el-popconfirm>
          </template>
        </template>
      </el-table-column>
    </el-table>

    <!-- 分页 -->
    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
      layout="total, sizes, prev, pager, next, jumper" :page-sizes="[10, 20, 50, 100]" :current-page="current"
      :page-size="size" :total="total">
    </el-pagination>

    
  </div>
</template>

<script>
  export default {
    name: "UnitsManagement",
    data() {
      return {
        InfoTable: [
          {
            name: '赣南医学院(黄金校区)',
            unitsPeoples: 1500,
            telePhone: '18317910068',
            unitsPeoples: '赣州市xxxxxxx'
          },
          {
            name: '赣南医学院(白银校区)',
            unitsPeoples: 1400,
            telePhone: '13317910068',
            address: '赣州市xxxxxxx'
          },
          {
            name: '赣南医学院(青铜校区)',
            unitsPeoples: 1200,
            telePhone: '14317910028',
            address: '赣州市xxxxxxx'
          },
        ],
      }
    },
    methods: {
      // 勾选后触发
      handleSelectionChange(val) {
        console.log("勾选项：", val);
        // 获取所有勾选项
        this.multipleSelection = val;

        this.delBtlStatu = val.length == 0;
        this.$refs.child.delBtlStatu = this.delBtlStatu;
        console.log(this.$refs.child.delBtlStatu)
      },
    }
  }
</script>

<style scoped>
</style>